
		<div class="row">
			<form name="Query"  class="form-horizontal ajax-form" method="post" action="{{urlfor "CdrController.List"}}">
				<div  >
				</div>
			</form>
			
		</div>
		<script type="text/javascript">
				 $("input[name$='begindate']").datepicker({
					 format: "yyyy-mm-dd",
				    language: "zh-CN",
				    daysOfWeekHighlighted: "1,2,3,4,5",
				    autoclose: true,
				    todayHighlight: true
				});
				$("input[name$='enddate']").datepicker({
					 format: "yyyy-mm-dd",
				    language: "zh-CN",
				    daysOfWeekHighlighted: "1,2,3,4,5",
				    autoclose: true,
				    todayHighlight: true
				}); 
				 
		</script>
		<div class="space-4"></div>

		<div class="row">
			<div class="col-xs-12">
				<table class="table table-striped table-bordered table-hover">
					<thead>
					<tr>

						<th>AppId</th>
						<th>主叫名称</th>
						<th>主叫号码</th>
						
						<th>路由名称</th>
						<th>应答时间</th>
						<th>结束时间</th>
						
						<th>通话时长</th>
						<th>计费费用</th>
						<th>计费单位</th>
						<th>话单类型</th>
						<th>扩展字段</th>
						<th>请求时间</th>
						<th>组织名称</th>
						<th>计费费率</th>
						<th>详情</th>
					</tr>
					</thead>	
					<tbody>				 
					{{range  $v := .list}}
						<tr>

							<td>{{$v.App_id}}</td>
							<td>{{ $v.Caller}} </td>
							<td>{{$v.Callee}} </td>
							<td>{{$v.Call_route }}</td>
							<td>{{$v.Call_answertime}}</td>
							<td>{{ $v.Call_endtime}} </td>
							<td>{{$v.Call_duration}}						 </td>
							<td>{{ $v.Call_bill}}</td>
							<td>{{$v.Call_billunit}}</td>
							<td>{{$v.Cdr_type}}				 </td>
							<td>{{$v.Extends}}				 </td>
							<td>{{$v.Request_time}}			 </td>
							<td>{{$v.Org_name}}</td>
							<td>{{$v.Call_rate}}</td>
							<td><button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
								详情
							</button></td>
							 
						</tr>
						<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
											&times;
									</button>
									<h4 class="modal-title" id="myModalLabel">历史话单详情</h4>
									</div>
									<div class="modal-body">
									<ul>
										<li>callid : {{$v.Call_id}}</li>
										<li></li>
										<li></li>
										<li></li>
										<li></li>
										<li></li>
										<li></li>
										<li></li>
									</ul>
										
									</div>
									<div class="modal-footer">
											<button type="button" class="btn btn-default" data-dismiss="modal">关闭
											</button>
											<button type="button" class="btn btn-primary">提交更改</button>
										</div>
								</div><!-- /.modal-content -->
							</div><!-- /.modal -->
						</div>
					{{end}}
					</tbody>
				</table>
		</div>
        <div class="row">
			<div class="col-xs-12">{{str2html .pageBar}}</div>
		</div>